基本用法
//一般函数写法: function () {...} //es6箭头函数写法:() => {...}
简写规范
1、如果有且只有一个参数,()也可以不写;
2、如果有且仅有一个语句,并且是return,{}也可以不写
function add(num) {
return num + 5;
}
function show(num,fn) {
alert(fn(num));
}
show(5,add);
//可简写为:
show(5,n=>n+5);
//对数组的元素进行升序排序
//es5写法:
arr.sort(function(a,b) {
return a - b;
})
//es6写法
arr.sort((a,b) => a - b);
ES6中的箭头函数的作用不仅仅是为简写,最大用处还是在修正this
let obj = {
a:12,
fn:function() {
console.log(this.a);
}
}
obj.fn();
let date = new Date();
date.fn = obj.fn;
date.fn();
//按照es6中,箭头函数修正this的思路进行改造
let obj = {
a:12,
fn:()=> {
console.log(this.a);
}
}
obj.fn();
let date = new Date();
date.fn = obj.fn;
date.fn();
//原因:1、由于箭头函数是作为对象字面量的属性定义的,对象字面量在全局代码中定义,因此,箭头函数内部的this值与全局函数的this值相同
//2、如果箭头函数被非箭头函数包含,则this绑定指向的是最近一层非箭头函数的this;否则,this的值会被设置为全局对象
let obj2 = {
fn:()=>{
console.log(this);
}
}
obj2.fn(); //window
let obj = {
fn:function() {
return ()=> {console.log(this);}
}
}
obj.fn()();//==>{fn: ƒ}
//回归es5,this对象是在运行时,基于函数时的执行环境绑定的,在全局函数中,this指向window,当函数被当做某个对象的方法调用时,this等于那个对象。
//es6中,箭头函数this固定为当前的环境,箭头函数的this是在定义函数的时候绑定,而不是在执行函数的时候绑定。
class Json{
constructor () {
this.a = 12;
this.fn = () => {
console.log(this.a);
}
}
}
var obj = new Json();
obj.fn(); //12
var date = new Date();
date.fn = obj.fn;
date.fn(); // 12